<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="sj" tagdir="/WEB-INF/tags/spring-jquery-tags"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<script type="text/javascript">
	$(document).ready(function() {
		$('#pageTitle').text('<spring:message code="addPayee.heading" />');
		$("#editPayeeForm").validate({
			rules : {
				payeeName : {
					required : true
				}
			}
		});
		
		$("#countries").change(function() {
			loadDataViaAjax("loadStates.do", {
				"countryId" : this.value
			}, parseStatesJson);
		});

		$("#countries").change();
		
		<c:if test="${!empty payee.id && payee.id > 0}">
		$('#updateBankInfo').click(function() {
			loadDiv('content', 'showEditPayeeBankInfo.do?id=${payee.id}');
		});
		</c:if>

		$('.close-button').click(function() {
			loadDiv('content', '${paymentUrl}');
   		});
		
		$('.cancel-button').click(function() {
			loadDiv('content', '${paymentUrl}');
		});	
	});
	
	function parseStatesJson(data) {
		var stateId = '${payee.payeestate.id}';
		
		var html = '<option value="">Select</option>';
		if (data) {
			for (p in data) {
				if(stateId == p) {
					html += "<option selected='selected' value='" + p + "'>" + data[p] + "</option>";
				} else {
					html += "<option value='" + p + "'>" + data[p] + "</option>";
				}
			}
		}		
		$("#states option").remove();
		$("#states").append(html);
	}
	
	function setSubmitAction(){
		$("#submitAction").val("AddBankInfo");
	}
</script>
<div id="editPayeeDiv">
	<form:form name="editPayeeForm" id="editPayeeForm" action="savePayee.do" method="post" modelAttribute="payee">
		<form:hidden path="id" />
		<form:hidden path="submitAction" />
		<input type="hidden" name="mode" value="${mode }" />
		<input type="hidden" name="paymentUrl" value="${paymentUrl }" />
		<div class="main_form">
			<div class="form_head">
				<c:if test="${!empty mode && mode == 'editMode' }">
				<div class="floatL" style="padding-top:5px; width: 800px;">
					<a id="updateBankInfo" href="#" class="blue_btn" onclick="return false;"><spring:message code="payee.bankinfo.heading" /></a>
				</div>
				</c:if>
	    		<a href="#" class="close-button gray_btn floatR">Close Form</a><br class="clear" />
	    	</div>
	    	<div class="form_cont">
				<table cellspacing="10" width="100%">
					<tr class="row">
						<td class="input-field" colspan="3" align="center">
							<%@ include file="/common/messages.jsp" %>
						</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeeName" /></td>
						<td class="input-field">
							<form:input path="payeeName" cssClass="input-full-width text_white-req text_blue" />
							<form:errors path="payeeName" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeetype" /></td>
						<td class="input-field">
							<form:select path="payeetype" cssClass="text_white">
								<form:option value="" label="Select" />
								<form:option value="Partner" label="Partner" />
								<form:option value="Staff" label="Staff" />
								<form:option value="Field Office" label="Field Office" />
								<form:option value="Other" label="Other" />
							</form:select>
							<form:errors path="payeetype" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeeEmail" /></td>
						<td class="input-field">
							<form:input path="payeeEmail" cssClass="input-full-width text_white" />
							<form:errors path="payeeEmail" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.country" /></td>
						<td class="input-field">
							<form:select path="payeeCountry.id"	id="countries" cssClass="text_white">
								<form:option value="" label="Select" />
								<form:options items="${countryList}" itemValue="id" itemLabel="displayName" />
							</form:select>
							<form:errors path="payeeCountry.id" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.state" /></td>
						<td class="input-field">
							<form:select path="payeestate.id" id="states" cssClass="text_white">
							</form:select>
							<form:errors path="payeestate.id" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>						
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeeAddress1" /></td>
						<td class="input-field">
							<form:input path="payeeAddress1" cssClass="input-full-width text_white" />
							<form:errors path="payeeAddress1" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeeAddress2" /></td>
						<td class="input-field">
							<form:input path="payeeAddress2" cssClass="input-full-width text_white" />
							<form:errors path="payeeAddress2" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeeCity" /></td>
						<td class="input-field">
							<form:input path="payeeCity" cssClass="input-full-width text_white" />
							<form:errors path="payeeCity" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeeZipCode" /></td>
						<td class="input-field">
							<form:input path="payeeZipCode" cssClass="input-full-width text_white" />
							<form:errors path="payeeZipCode" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeePhone" /></td>
						<td class="input-field">
							<form:input path="payeePhone" cssClass="input-full-width text_white" />
							<form:errors path="payeePhone" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeeFax" /></td>
						<td class="input-field">
							<form:input path="payeeFax" cssClass="input-full-width text_white" />
							<form:errors path="payeeFax" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.payeeUrl" /></td>
						<td class="input-field">
							<form:input path="payeeUrl" cssClass="input-full-width text_white" />
							<form:errors path="payeeUrl" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
                    <tr class="row">
                        <td class="label2">Employer Tax ID</td>
                        <td class="input-field">
                            <form:input path="employerTaxId" cssClass="input-full-width text_white" />
                            <form:errors path="employerTaxId" cssClass="error" />
                        </td>
                        <td width="50">&nbsp;</td>
                    </tr>
					<tr class="row">
						<td class="label2"><spring:message code="editPayee.label.inactive" /></td>
						<td class="input-field">
							<form:checkbox path="inactive" />
							<form:errors path="inactive" cssClass="error" />
						</td>
						<td width="50">&nbsp;</td>
					</tr>
					<tr class="row">
						<td class="label2"></td>
						<td class="input-field"></td>
						<td width="50">&nbsp;</td>
					</tr>					
					<tr class="row">
						<td class="input-field" align="center" colspan="3">
							<input type="button" class="cancel-button gray_btn" value="Cancel"> 
							<sj:submit cssClass="blue_btn" id="save" target="editPayeeDiv" key="editPayee.button.save" validate="true" />
							<c:if test="${empty mode || mode != 'editMode' }">
								<sj:submit cssClass="blue_btn" id="saveAndAddBankInfo" target="editPayeeDiv" key="editPayee.button.saveAddBankInfo" validate="true" />
							</c:if>
						</td>
					</tr>
				</table>
			</div>
		</div>
	</form:form>
	<script type="text/javascript">
		$(document).ready(function() {
			$('table.tablesorter').tablesorter({
				widgets : [ 'zebra' ],
				sortList : [ [ 0, 0 ] ],
				headers : {
					3 : {
						sorter : false
					},
					4 : {
						sorter : false
					}
				}
			});

			$('.edit-payeeaward-link').click(function() {
				loadDiv('content', 'showEditPayeeaward.do?id=' + $(this).attr('payeeawardId'));
			});
		});
	</script>
	<div id="payeeawardListDiv" class="hastable">
		<%-- <table class="tablesorter">
		<thead>
			<tr>
				<th><spring:message code="payeeawardlist.table.heading.payeeAwardNumber"/></th>
				<th><spring:message code="payeeawardlist.table.heading.payeeAwardDesc"/></th>
				<th><spring:message code="payeeawardlist.table.heading.startDate"/></th>
				<th><spring:message code="payeeawardlist.table.heading.city"/></th>
				<th><spring:message code="payeeawardlist.table.heading.state"/></th>							
				<th><spring:message code="payeeawardlist.table.heading.viewAward"/></th>
				<th><spring:message code="payeeawardlist.table.heading.edit"/></th>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${payee.payeeawards}" var="payeeaward">
				<tr>
					<td>${payeeaward.payeeAwardNumber}</td>
					<td>${payeeaward.payeeAwardDesc}</td>
					<td>${payeeaward.startDate}</td>
					<td>${payeeaward.city}</td>
					<td>${payeeaward.state}</td>				
					<td><a href="javascript://" class="view-awards-link" payeeawardId="${payeeaward.id}"><spring:message code="payeeawardlist.table.link.viewAward"/></a></td>
					<td><a href="javascript://" class="edit-payeeaward-link" payeeawardId="${payeeaward.id}"><spring:message code="payeeawardlist.table.link.edit"/></a></td>
				</tr>
			</c:forEach>
		</tbody>
	</table> --%>
		<div id="payeeawardListPager"></div>
	</div>
</div>
